<template>
  <div style="height:100%;background-color:#f4f7fa ">
    <div>
      <el-steps :active="1" align-center style="padding-top:20px">
        <el-step title="填写入库申请"></el-step>
        <el-step title="审核入库申请"></el-step>
        <el-step title="创建入库计划"></el-step>
        <el-step title="车辆到达"></el-step>
        <el-step title="开始作业"></el-step>
        <el-step title="作业完成"></el-step>
        <el-step title="离开园区"></el-step>
      </el-steps>
      <!-- <el-button type="primary" size="mini"  style="margin: 10px 0 0 30px" @click="cretedInfoDtail('0')">保存</el-button>
      <el-button type="primary" size="mini"  style="margin: 10px 0 0 10px" @click="cretedInfoDtail('1')">保存并提交</el-button>
      <el-card style="margin:7px 30px 10px;"> -->
        <div style="position:relative;">
            <el-button type="primary" size="mini" :loading="this.bLoading" style="margin: 20px 0 0 30px" @click="cretedInfoDtail('0')">保存</el-button>
            <el-button type="primary" size="mini" :loading="this.bLoading" style="margin: 20px 0 0 10px" @click="cretedInfoDtail('1')">保存并提交</el-button>
            <el-button type="primary" @click="onIsShows" size="mini" style="position:absolute;top:10px;right:0px;margin: 10px 30px 0 0">返回</el-button>
            <el-card style="margin:7px 30px 10px;">
                <div>
                    <el-row>
                        <!-- <el-col :span="2" style="line-height:40px;font-size:15px;font-weight:700;margin-top:-2px">入库信息</el-col> -->
                        <el-col :span="0.7" style="line-height:40px">仓库：</el-col>
                        <el-col :span="3">
                            <el-input size="mini" style="margin-top:5px" :value="wareList.length ? wareList.filter(item => item.id == this.$props.menuActiveName)[0].whName : ''" :disabled="true" placeholder="请输入内容"></el-input>
                        </el-col>
                        <el-col :span="0.8" style="line-height:40px;margin-left:10px">货权方：</el-col>
                        <el-col :span="4">
                            <!-- <el-input size="mini" style="margin-top:5px" v-model="cargoOwner.dictName" :disabled="false" placeholder="请输入货权方全称" @blur="cargoOwnerBlur"></el-input> -->
                            <el-select
                                v-model="selectCustomer"
                                filterable
                                size="mini"
                                :disabled="!$utils.getUserInfo().currentAgentPermission"
                                style="width: 100%; margin-top: 5px"
                                @change="!settlementCustomer && (settlementCustomer = $event)"
                            >
                                <el-option
                                    v-for="item in customerInfoList"
                                    :key="item.customerPartyID"
                                    :value="item.customerPartyCode"
                                    :label="item.customerPartyName"
                                />
                            </el-select>
                            <span v-if="!isCustomerNameInWMS" style="color: red;">WMS中不存在此客户</span>
                        </el-col>
                        <el-col :span="1.4" style="line-height:40px;margin-left:10px">结算客户：</el-col>
                        <el-col :span="4">
                            <!-- <el-input size="mini" style="margin-top:5px" v-model="settlementCustomer" placeholder="请输入结算客户"></el-input> -->
                            <el-select
                                v-model="settlementCustomer"
                                filterable
                                size="mini"
                                :disabled="!$utils.getUserInfo().currentAgentPermission"
                                style="width: 100%; margin-top: 5px"
                            >
                                <el-option
                                    v-for="item in customerInfoList"
                                    :key="item.customerPartyID"
                                    :value="item.customerPartyCode"
                                    :label="item.customerPartyName"
                                />
                            </el-select>
                        </el-col>
                    </el-row>
                </div>
            </el-card>
            <el-card style="margin:10px 30px">
                <div class="boxMsg">
                    <span style="font-size:16px;font-weight:700;margin-right:15px;">入库箱信息</span>
                    <el-button type="primary" size="mini" @click="boxInformation" :disabled="this.editStatus == 'create'">新增</el-button>
                    <el-button type="primary" size="mini" @click="batchDelete" :disabled="!this.multipleSelection.length > 0">批量删除</el-button>
                    <!-- <el-button type="primary" size="mini" >导出模板</el-button>
                    <el-button type="primary" size="mini" >导入</el-button> -->
                    <el-form :rules="rules" :model="tableData"  ref="form">
                        <el-table
                            size="mini"
                            :data="tableData.tableInfo"
                            @row-click="handleOnChange"
                            highlight-current-row
                            @selection-change="handleSelectionChange"
                            ref="multipleTable"
                            :header-cell-style="{'font-weight': 300,'color': '#111'}"
                            style="width: 100%">
                            <el-table-column
                                type="selection"
                                width="55">
                            </el-table-column>
                            <el-table-column
                                v-for="item in tableData.cloumns"
                                :key="item.prop"
                                :prop="item.prop"
                                :render-header="(h,obj) => addRedStar(h, obj, item.isWrited)"
                                :label="item.label"
                                align="center"
                                :width="item.width">
                                <template  slot-scope="scope">
                                    <div v-if="item.type == 'input'">
                                        <el-form-item v-if="item.prop == 'containerNum'" :prop="'tableInfo.' + scope.$index + '.containerNum'" :rules='rules.containerNum'>
                                            <el-input v-model="scope.row[item.prop]" size="mini" :placeholder="'请输入' + item.label"></el-input>
                                        </el-form-item>
                                        <el-form-item v-else>
                                            <el-input v-model="scope.row[item.prop]" size="mini" :placeholder="'请输入' + item.label" :disabled="(item.prop == 'outCarNo' || item.prop == 'outDriver' || item.prop == 'outTel') && scope.row.businessType != 'move'"></el-input>
                                        </el-form-item>
                                    </div>
                                    <div v-else-if="item.type == 'select'">
                                        <el-select v-model="scope.row[item.prop]" size="mini" placeholder="" @change="changesInfo">
                                            <el-option
                                                v-for="busi in businessList"
                                                :key="busi.id"
                                                :label="busi.dictName"
                                                :value="busi.dictValue">
                                            </el-option>
                                        </el-select>
                                    </div>
                                    <div v-else-if="item.type == 'date'">
                                        <el-date-picker
                                            v-model="scope.row[item.prop]"
                                            type="date"
                                            size="mini"
                                            placeholder="选择日期"
                                            style="width:140px">
                                        </el-date-picker>
                                    </div>
                                    <div v-else-if="item.type == 'radio'">
                                        <el-checkbox v-model="scope.row[item.prop]" true-label="1" false-label="0" :disabled="item.prop == 'intoSeparationChargeSign' && scope.row.businessType == 'move'"></el-checkbox>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column  fixed="right" label="操作" width="200" align="center" >
                                <template slot-scope="scope">
                                    <div style="display: flex;justify-content: center">
                                        <el-button type="text" size="mini" @click.native.prevent="boxCretedInfo(scope.$index,tableData.tableInfo)">新增货物信息</el-button>
                                        <el-button type="text" size="mini" @click.native.prevent="boxDelete(scope,tableData.tableInfo)" :disabled="editStatus == 'create'">删除</el-button>
                                    </div>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-form>
                </div>
            </el-card>
            <el-card style="margin:10px 30px">
                <div>
                    <!-- <el-button type="primary" size="mini" @click="goodsInformation">新增</el-button> -->
                    <col><span style="font-size:16px;font-weight:700;margin-right:15px;">货物信息</span> </col>
                    <el-button type="primary" size="mini"  @click="batchDeletes" :disabled="!multipleSelections.length > 0">批量删除</el-button>
                    <el-table
                        :data="tableData.tableInfoList"
                        :header-cell-style="{'font-weight': 300,'color': '#111'}"
                        size="mini"
                        @selection-change="handleSelectionChanges"
                        style="width: 100%">
                        <el-table-column
                            type="selection"
                            width="55">
                        </el-table-column>
                        <el-table-column
                            v-for="item in tableData.goodsCloumns"
                            :key="item.prop"
                            align="center"
                            :prop="item.prop"
                            :render-header="(h,obj) => addRedStar(h, obj, item.isWrited)"
                            :label="item.label"
                            :width="item.width">
                            <template  slot-scope="scope">
                                <div v-if="item.type == 'input'">
                                    <el-input v-model="scope.row[item.prop]" size="mini" :placeholder="'请输入' + item.label"></el-input>
                                </div>
                                <div v-else-if = "item.type == 'number'">
                                    <el-input-number v-if = "item.prop == 'orderWeight'" :placeholder="'请输入' + item.label" controls-position="right" size="small" :precision="3" @on-focus="focusHandler(item)" @on-blur="blurHandler(item)" :max="100000000000000000000" :formatter="item.formatter" :min="1" :step="1" v-model="scope.row[item.prop]"></el-input-number>
                                    <el-input-number v-if = "item.prop == 'orderQty'" :placeholder="'请输入' + item.label" controls-position="right" size="small" @on-focus="focusHandler(item)" @on-blur="blurHandler(item)" :formatter="item.formatter" :min="1" :step="1" v-model="scope.row[item.prop]"></el-input-number>
                                    <el-input-number v-if = "item.prop == 'validatePeriod'" @change='dateChangeEvent(item.prop,scope.row)' :placeholder="'1' + item.label" controls-position="right" size="small" :min="1" :step="1" v-model="scope.row[item.prop]" style="width:100px"></el-input-number>
                                    <el-input-number v-if = "item.prop == 'codeQty'" :placeholder="'请输入' + item.label" controls-position="right" size="small" :min="0" :step="1" v-model="scope.row[item.prop]"  :disabled="item.prop == 'codeQty' && !scope.row['ifCodeReading']"></el-input-number>
                                </div>
                                <div v-else-if="item.type == 'select'">
                                    <div v-if="item.prop == 'matTypCode'">
                                        <el-select v-model="scope.row[item.prop]" filterable :value="tableData.tableInfo[0].matTypName ? tableData.tableInfo[0].matTypName : ''"  size="mini"  placeholder="请选择品类" @change="changesInfos($event,scope.row)">
                                            <el-option
                                                v-for="keys in categoryList"
                                                :key="keys.id"
                                                :label="keys.dictName"
                                                :value="keys.dictValue">
                                            </el-option>
                                        </el-select>
                                    </div>
                                    <div v-if="item.prop == 'matName'">
                                        <el-select v-model="scope.row[item.prop]" filterable allow-create :value="tableData.tableInfo[0].matName ? tableData.tableInfo[0].matName : ''" size="mini"  placeholder="请选择品名" @change="changesInfos($event,scope.row)">
                                            <el-option
                                                v-for="keys in scope.row.categoryLists"
                                                :key="keys.matCode"
                                                :label="keys.matName"
                                                :value="keys.matCode">
                                            </el-option>
                                        </el-select>
                                    </div>
                                    <div v-if="item.prop == 'packFormat' && (menuActiveName == 26 || menuActiveName == 37)">
                                        <el-select v-model="scope.row[item.prop]"  size="mini"  :placeholder="'请选择'" clearable>
                                            <el-option
                                                v-for="keys in packingSpecificationList"
                                                :key="keys.id"
                                                :label="keys.dictName"
                                                :value="keys.dictValue">
                                            </el-option>
                                        </el-select>
                                    </div>
<!--                                    <div v-if="item.prop == 'packageType' && menuActiveName == 37">
                                        <el-select v-model="scope.row[item.prop]"  size="mini"  :placeholder="'请选择'" clearable>
                                            <el-option
                                                v-for="keys in packingSpecificationList"
                                                :key="keys.id"
                                                :label="keys.dictName"
                                                :value="keys.dictValue">
                                            </el-option>
                                        </el-select>
                                    </div>-->
<!--                                    货物规格-->
                                    <!--<div v-if="item.prop == 'packCode' && menuActiveName == 37">
                                        <el-select v-model="scope.row[item.prop]"  size="mini"  :placeholder="'请选择'" clearable>
                                            <el-option
                                                v-for="keys in cargoSpecificationList"
                                                :key="keys.id"
                                                :label="keys.packName"
                                                :value="keys.packCode">
                                            </el-option>
                                        </el-select>
                                    </div>-->
                                    <div v-if="item.prop == 'packName' && menuActiveName == 27">
                                        <el-select v-model="scope.row[item.prop]"  size="mini"  :placeholder="'请选择' + item.label" clearable>
                                            <el-option
                                                v-for="keys in selectPackInfoList"
                                                :key="keys.id"
                                                :label="keys.packName"
                                                :value="keys.packFormat">
                                            </el-option>
                                        </el-select>
                                    </div>
                                </div>
                                <div v-else-if="item.type == 'date'">
                                    <el-date-picker
                                        v-model="scope.row[item.prop]"
                                        @change="dateChangeEvent(item.prop,scope.row)"
                                        :disabled="item.prop==='expireDate'"
                                        type="date" size="mini"
                                        placeholder="选择日期"
                                        style="width: 140px">
                                    </el-date-picker>
                                </div>
                                <div v-else-if="item.type == 'checkBox'">
                                    <el-checkbox v-model="scope.row[item.prop]" @change="checkBoxChange"></el-checkbox>
                                </div>
                                <div v-else>
                                    <el-input v-model="scope.row[item.prop]" size="mini" placeholder="请输入内容"></el-input>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column  fixed="right"  width="100"  label="操作" align="center">
                            <template  slot-scope="scope">
                                <el-button type="text" size="mini" @click.native.prevent="boxDtailDelete(scope)">删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </el-card>
            <el-card style="margin:10px 30px">
                <attachment-model ref="attachmentRef" :url="`/api/wms_file/customerUpload`" :select-row.sync="selectRow" :menu-active-name="menuActiveName" :wms-url="wmsUrl" @check-data="checkData" @refresh-file-list="refreshFileList"/>
            </el-card>
        </div>
      <!-- </el-card> -->
    </div>
  </div>
</template>

<script>
import {WarehousingCreted, getBoxInfoWarehousing, getBusinessInfo, getCategoryInfo, selectPackInfo, addIntoMaterialData,
    getBusinessInfos, packingSpecification, getCargoSpecification, updateApplyAndApplyDetail, testContainerNumber,selectCustomerInfoByDto} from '@/api/planInfo.js'
import {getByCustomerType} from '@/api/outInto';
import baseCodeApi from '@/api/baseCode';
import { v4 as uuidv4 } from 'uuid';
import _ from 'lodash';
import AttachmentModel from '@/view/component/attachment/index.vue'
export default {
    components: {
        AttachmentModel
    },
    props:{
        menuActiveName:{
            type:String,
            default:''
        },
        wmsUrl:{
            type:String,
            default:''
        },
        wareList:{
            type:Object,
            default:() => {}
        },
        editItem: {
            type:Object,
            default:() => {}
        },
        editItemWarehousing: {
            type:Object,
            default:() => {}
        },
        editData: {
            type: Object,
            default:() => {}
        },
        editStatus: {
            type: Boolean,
            default:false
        }
    },
    data() {
        // let validateContainerNum = (rule, value, callback) => {
        //     testContainerNumber(value,this.$props.wmsUrl).then(({data}) => {
        //         if (data.returnCode !== 200) {
        //             if(data.returnMsg === '集装箱号必须为11位!') {
        //                 this.$Message.warning(data.returnMsg)
        //                 callback(data.returnMsg)
        //             }
        //         }
        //     })
        // }
        return {
            complete: new Promise((resolve, reject) => {
                this.resolveComplete = resolve;
                this.rejectComplete = reject;
            }),
            selectCustomer: '',
            packingSpecificationList: [],
            cargoSpecificationList: [],
            numberW: 0,
            rules: {
                // containerNum:{ required:true , trigger:"blur", validator: validateContainerNum }
                containerNum:{ required:true , trigger:"blur", message: '请输入箱号' }
            },
            ccisCustomerCode: '',
            bLoading: false,
            tableData:{
                tableInfo:[],
                tableInfoList:[],
                cloumns:[{
                    prop: "billOfLandingNo",
                    label: "提单号",
                    type: 'input',
                    width: "200"
                },{
                    prop: "containerNum",
                    type: 'input',
                    label: "箱号",
                    width: "150"
                },{
                    prop: "shipName",
                    label: "船名",
                    type: 'input',
                    width: "150"
                },{
                    prop: "voyageNum",
                    label: "航次",
                    type: 'input',
                    width: "150"
                },{
                    prop: "contractNo",
                    label: "合同号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "carNo",
                    label: "送货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driver",
                    label: "送货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driverTel",
                    label: "司机联系方式",
                    type: 'input',
                    width: "160"
                },{
                    prop: "businessType",
                    label: "业务类型",
                    type: 'select',
                    width: "150",
                },{
                    prop: "inEstimateDate",
                    label: "预计送货日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "intoSeparationChargeSign",
                    label: "分色",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "authenticateFlag",
                    label: "出库密钥",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "remark",
                    label: "备注",
                    type: 'input',
                    width: "200"
                }],
                goodsCloumns:[{
                    prop: "matTypCode",
                    label: "品类",
                    type: 'select',
                    width: "150"
                },{
                    prop: "matName",
                    label: "品名",
                    type: 'select',
                    width: "220"
                },{
                    prop: "county",
                    label: "国别",
                    type: 'input',
                    width: "150"
                },{
                    prop: "batchNum",
                    label: "批次号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "factoryCode",
                    label: "厂号",
                    type: 'input',
                    width: "140"
                },{
                    prop: "packFormat",
                    label: "包装规格",
                    type: 'select',
                    width: "110"
                },{
                    prop: "orderQty",
                    label: "件数",
                    type: 'number',
                    width: "140",
                },{
                    prop: "orderWeight",
                    label: "重量(KGS)",
                    type: 'number',
                    width: "170"
                },{
                    prop: "dateGen",
                    label: "生产日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "validatePeriod",
                    label: "保质期（月）",
                    type: 'number',
                    width: "140"
                },{
                    prop: "ifCodeReading",
                    label: "抄码",
                    type:'checkBox',
                    width: "80"
                },{
                    prop: "codeQty",
                    label: "抄码件数",
                    width: "150",
                    type: 'number'
                }],
            },
            checkbox: false,
            value: '',
            settlementCustomerCode: '',
            multipleSelection:[],
            multipleSelections:[],
            isCreted:false,
            settlementCustomer:'',
            businessList:[],
            categoryList:[],
            categoryLists:[],
            dictInfo:[],
            cargoOwner:{},
            settlementCustomerName:'',
            selectPackInfoList: [],
            wmsCustomerList: [],
            cargoOwnerErrorShow: false,
            selectRow: null
        }
    },
    methods: {
        resolveComplete() {},
        rejectComplete() {},

      dateChangeEvent(prop,row){
          if("dateGen" === prop || 'validatePeriod' === prop){
            var dateGen = row['dateGen'];
            var month = row['validatePeriod'];
            if(dateGen){
              if(dateGen){
                const curTime = new Date(dateGen.getTime()),
                  // D1 = dateGen.getDate(),
                  D1 = dateGen.getMonth(),
                  date = new Date(curTime);
                date.setMonth(D1 + month);
                this.$delete(row, 'expireDate')
                this.$set(row, 'expireDate', date)
              }
            }
          }
      },
        cargoOwnerBlur() {
            this.cargoOwnerErrorShow = this.cargoOwner.dictName && !this.wmsCustomerList.find(x => x.customerName === this.cargoOwner.dictName);
        },
        addRedStar(h, { column }, required) {
            if (column.property == 'containerNum' || column.property == 'matTypCode' || column.property == 'matName') {
                return [
                    h('span', { style: 'color: red' }, '*'),
                    h('span', ' ' + column.label)
                ]
            } else {
                return [
                    h('span', { } , column.label)
                ]
            }
        },
        changesInfos(row,rows){
            if (rows.categoryList) {
                rows.categoryList.forEach((item) => {
                    if (item.dictValue == row) {
                        // rows['matTypName'] = item.dictName
                    }
                })
            }
            if (rows.categoryLists) {
                rows.categoryLists.forEach((item) => {
                    if (item.matCode == row) {
                        rows['matCode'] = item.matCode;
                        rows['packType'] = item.packageType;
                        rows['matName'] = item.matName
                        let body = {
                            ownerCode: this.ccisCustomerCode,
                            materialAndPacks: [item]
                        }
                        addIntoMaterialData(body, this.$props.wmsUrl).then(({data}) => {})
                    }
                })
            }
            getBusinessInfos({matTypCode:rows.matTypCode,ownerCode:this.ccisCustomerCode},this.$props.wmsUrl).then(res=>{
                this.$set(rows,'categoryLists', res.data.returnData)
                //  if(rows.matCode != ''){
                //    rows.matCode = ''
                //  }
            })
        },
        // blurHandler(item) {
        //   if (item.prop == 'validatePeriod') {
        //     this.tableData.tableInfoList.forEach((item) => {
        //       item.validatePeriod = (item.validatePeriod).toFixed(3)
        //     })
        //   } else if (item.prop == 'orderQty') {
        //     this.tableData.tableInfoList.forEach((item) => {
        //       item.orderQty = (item.orderQty).toFixed(3)
        //     })
        //   } else if (item.prop == 'orderWeight') {
        //     this.tableData.tableInfoList.forEach((item) => {
        //       item.orderWeight = (item.orderWeight).toFixed(3)
        //     })
        //   }
        // },
        blurHandler(item) {
            this.numberW = 3;
        },
        focusHandler(item) {
            this.numberW = 3;
        },
        changesInfo(row){
            if (this.menuActiveName == '26' || this.menuActiveName == '37') {
                this.tableData.cloumns = [
                {
                    prop: "billOfLandingNo",
                    label: "提单号",
                    type: 'input',
                    width: "200"
                },{
                    prop: "containerNum",
                    type: 'input',
                    label: "箱号",
                    width: "150"
                },{
                    prop: "inEstimateDate",
                    label: "预计送货日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "carNo",
                    label: "送货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driver",
                    label: "送货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driverTel",
                    label: "司机联系方式",
                    type: 'input',
                    width: "160"
                },{
                    prop: "businessType",
                    label: "业务类型",
                    type: 'select',
                    width: "150"
                },{
                    prop: "outCarNo",
                    label: "提货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outDriver",
                    label: "提货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outTel",
                    label: "提货司机联系方式",
                    type: 'input',
                    width: "200"
                },{
                    prop: "intoSeparationChargeSign",
                    label: "分色",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "authenticateFlag",
                    label: "出库密钥",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "remark",
                    label: "备注",
                    type: 'input',
                    width: "200"
                }]
                this.tableData.goodsCloumns = [
                {
                    prop: "matTypCode",
                    label: "品类",
                    type: 'select',
                    width: "150"
                },{
                    prop: "matName",
                    label: "品名",
                    type: 'select',
                    width: "220"
                },{
                    prop: "county",
                    label: "国别",
                    type: 'input',
                    width: "150"
                },{
                    prop: "factoryCode",
                    label: "厂号",
                    type: 'input',
                    width: "140"
                },{
                    prop: "packFormat",
                    label: "包装规格",
                    type: 'select',
                    width: "110"
                },{
                    prop: "orderQty",
                    label: "件数",
                    type: 'number',
                    width: "140"
                },{
                    prop: "orderWeight",
                    label: "重量(KGS)",
                    type: 'number',
                    width: "170"
                },{
                    prop: "dateGen",
                    label: "生产日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "validatePeriod",
                    label: "保质期（月）",
                    type: 'number',
                    width: "140"
                },{
                    prop: "ifCodeReading",
                    label: "抄码",
                    type:'checkBox',
                    width: "80"
                },{
                    prop: "codeQty",
                    label: "抄码件数",
                    width: "150",
                    type: 'number'
                }]
            } else if (this.menuActiveName == '37') {
                this.tableData.cloumns = [
                {
                    prop: "billOfLandingNo",
                    label: "提单号",
                    type: 'input',
                    width: "200"
                },{
                    prop: "containerNum",
                    type: 'input',
                    label: "箱号",
                    width: "150"
                },/*{
                    prop: "shipName",
                    label: "船名",
                    type: 'input',
                    width: "150"
                },{
                    prop: "voyageNum",
                    label: "航次",
                    type: 'input',
                    width: "150"
                },{
                    prop: "contractNo",
                    label: "合同号",
                    type: 'input',
                    width: "150"
                },*/{
                    prop: "carNo",
                    label: "送货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driver",
                    label: "送货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driverTel",
                    label: "司机联系方式",
                    type: 'input',
                    width: "160"
                },{
                    prop: "businessType",
                    label: "业务类型",
                    type: 'select',
                    width: "150"
                },{
                    prop: "outCarNo",
                    label: "提货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outDriver",
                    label: "提货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outTel",
                    label: "提货司机联系方式",
                    type: 'input',
                    width: "200"
                },{
                    prop: "inEstimateDate",
                    label: "预计送货日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "intoSeparationChargeSign",
                    label: "分色",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "authenticateFlag",
                    label: "出库密钥",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "remark",
                    label: "备注",
                    type: 'input',
                    width: "200"
                }]
                this.tableData.goodsCloumns = [
                    {
                        prop: "matTypCode",
                        label: "品类",
                        type: 'select',
                        width: "150"
                    },
                    {
                        prop: "matName",
                        label: "品名",
                        type: 'select',
                        width: "220"
                    },
                    {
                        prop: "county",
                        label: "国别",
                        type: 'input',
                        width: "150"
                    },
                    {
                        prop: "factoryCode",
                        label: "厂号",
                        type: 'input',
                        width: "140"
                    },
/*                    {
                        prop: "batchNum",
                        label: "批次号",
                        type: 'input',
                        width: "150"
                    },*/
                    {
                        prop: "packageType",
                        label: "包装规格",
                        type: 'select',
                        width: "180"
                    },
                    {
                        prop: "packCode",
                        label: "货物规格",
                        type: 'select',
                        width: "180"
                    },
                    {
                        prop: "orderQty",
                        label: "件数",
                        type: 'number',
                        width: "140"
                    },
                    {
                        prop: "orderWeight",
                        label: "重量(KGS)",
                        type: 'number',
                        width: "170"
                    },
                    {
                        prop: "dateGen",
                        label: "生产日期",
                        type: 'date',
                        width: "160"
                    },
                    {
                        prop: "expireDate",
                        label: "失效日期",
                        type: 'date',
                        width: "160"
                    },
                    {
                        prop: "validatePeriod",
                        label: "保质期（月）",
                        type: 'number',
                        width: "140"
                    },
                    {
                        prop: "ifCodeReading",
                        label: "抄码",
                        type:'checkBox',
                        width: "80"
                    },
                    {
                        prop: "codeQty",
                        label: "抄码件数",
                        width: "150",
                        type: 'number'
                    }
                ]
            } else {
                this.tableData.cloumns = [{
                    prop: "billOfLandingNo",
                    label: "提单号",
                    type: 'input',
                    width: "200"
                },{
                    prop: "containerNum",
                    type: 'input',
                    label: "箱号",
                    width: "150"
                },{
                    prop: "shipName",
                    label: "船名",
                    type: 'input',
                    width: "150"
                },{
                    prop: "voyageNum",
                    label: "航次",
                    type: 'input',
                    width: "150"
                },{
                    prop: "contractNo",
                    label: "合同号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "carNo",
                    label: "送货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driver",
                    label: "送货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "driverTel",
                    label: "司机联系方式",
                    type: 'input',
                    width: "160"
                },{
                    prop: "businessType",
                    label: "业务类型",
                    type: 'select',
                    width: "150"
                },{
                    prop: "outCarNo",
                    label: "提货车号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outDriver",
                    label: "提货司机",
                    type: 'input',
                    width: "150"
                },{
                    prop: "outTel",
                    label: "提货司机联系方式",
                    type: 'input',
                    width: "200"
                },{
                    prop: "inEstimateDate",
                    label: "预计送货日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "intoSeparationChargeSign",
                    label: "分色",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "authenticateFlag",
                    label: "出库密钥",
                    type: 'radio',
                    width: "100"
                },{
                    prop: "remark",
                    label: "备注",
                    type: 'input',
                    width: "200"
                }]
                this.tableData.goodsCloumns = [{
                    prop: "matTypCode",
                    label: "品类",
                    type: 'select',
                    width: "150"
                },{
                    prop: "matName",
                    label: "品名",
                    type: 'select',
                    width: "220"
                },{
                    prop: "county",
                    label: "国别",
                    type: 'input',
                    width: "150"
                },{
                    prop: "factoryCode",
                    label: "厂号",
                    type: 'input',
                    width: "140"
                },{
                    prop: "batchNum",
                    label: "批次号",
                    type: 'input',
                    width: "150"
                },{
                    prop: "packName",
                    label: "货物规格",
                    type: 'select',
                    width: "180"
                },{
                    prop: "orderQty",
                    label: "件数",
                    type: 'number',
                    width: "140"
                },{
                    prop: "orderWeight",
                    label: "重量(KGS)",
                    type: 'number',
                    width: "170"
                },{
                    prop: "dateGen",
                    label: "生产日期",
                    type: 'date',
                    width: "160"
                },{
                    prop: "validatePeriod",
                    label: "保质期（月）",
                    type: 'number',
                    width: "140"
                },{
                    prop: "ifCodeReading",
                    label: "抄码",
                    type:'checkBox',
                    width: "80"
                },{
                    prop: "codeQty",
                    label: "抄码件数",
                    width: "150",
                    type: 'number'
                }]
            }
        },
        selectCustomerInfoByDto() {
            selectCustomerInfoByDto({'ccisCustomerCode': this.selectCustomer}, this.$props.wmsUrl).then( ({data}) => {
                this.ccisCustomerCode = data.returnData[0].customerCode
                this.settlementCustomerName = data.returnData[0].customerName
            })
            this.$nextTick(() => {
                if (this.menuActiveName == 27) {
                    selectPackInfo({},this.$props.wmsUrl).then(({data}) => {
                        if (data.returnCode === 200) {
                            this.$nextTick(() => {
                                this.selectPackInfoList = data.returnData
                            })
                        }
                    })
                }
            })
        },
        checkBoxChange(status) {
            this.tableData.tableInfoList.forEach(item => {
                if (item.ifCodeReading) {
                    this.$set(item, 'codeQty' ,_.cloneDeep(item.orderQty))
                } else {
                    this.$set(item, 'codeQty' , 0)
                }
            })
        },
        async cretedInfoDtail(statusCode){
            try {
                this.bLoading = true
                if (this.tableData.tableInfo.length == 0) {
                    this.$Message.warning('请输入箱信息')
                    this.bLoading = false
                    return;
                }
                if (!this.selectCustomer) {
                    this.$Message.error('请选择货权方');
                    this.bLoading = false;
                    return;
                }
                if (!this.settlementCustomer) {
                    this.$Message.error('请选择结算客户');
                    this.bLoading = false;
                    return;
                }
                if (!this.isCustomerNameInWMS) {
                    this.$Message.error('货权方WMS中不存在此客户！');
                    this.bLoading = false
                    return;
                }
                this.ccisCustomerCode = this.selectCustomer;
                if (this.tableData.tableInfo[0].id) {
                    let { data } = await selectCustomerInfoByDto({'ccisCustomerCode': this.ccisCustomerCode}, this.$props.wmsUrl);
                    if (data.returnCode === 200) {
                        this.ccisCustomerCode = data.returnData[0].customerCode;
                    } else {
                        this.bLoading = false
                    }
                }
                this.tableData.tableInfo.forEach(item =>{
                    item.cargoOwner = this.ccisCustomerCode
                    item.settlementCustomer = this.settlementCustomer
                    item.status = statusCode
                    if (this.$props.editData && statusCode != 1) {
                        if (this.$props.editData.returnData.status == 2) {
                            if (this.menuActiveName == 37) {
                                item.status = -3
                            } else {
                                item.status = 2
                            }
                        } else {
                            item.status = statusCode
                        }
                    }
                })
                this.tableData.tableInfo.forEach(item =>{
                    item.list.forEach((items) => {
                        if (items.ifCodeReading == false) {
                            items.ifCodeReading = '0'
                        } else {
                            items.ifCodeReading = '1'
                        }
                    })
                })
                if (!(this.tableData.tableInfo[0].id === undefined || this.tableData.tableInfo[0].id === null)) {
                    delete this.tableData.tableInfo[0].warehousing;
                    this.tableData.tableInfo[0].list = [];
                    this.tableData.tableInfoList.forEach(item => {
                        this.tableData.tableInfo[0].list.push(item)
                    })
                    this.tableData.tableInfo[0].list.forEach((item) => {
                        if (item.ifCodeReading == false) {
                            item.ifCodeReading = '0'
                        } else {
                            item.ifCodeReading = '1'
                        }
                    })
                    updateApplyAndApplyDetail(this.tableData.tableInfo[0],this.$props.wmsUrl).then(res=>{
                        if(res.data.returnCode === 200){
                            this.bLoading = false
                            this.$Message.success('修改成功');
                            this.$router.push({
                                name: 'planInfo',
                                query:{
                                    planNum: 1
                                }
                            })
                            this.$emit('initData');
                        } else {
                            this.bLoading = false
                            this.$Message.warning(res.data.returnMsg)
                        }
                    })
                } else {
                    if (this.tableData.tableInfo[0].list.length > 0) {
                        this.tableData.tableInfo[0].list.forEach(item => {
                            delete item.categoryLists
                            delete item.categoryList
                            delete this.tableData.tableInfo[0].boxIds
                        })
                    }
                    this.tableData.tableInfo.forEach(item =>{
                        item.cargoOwner = this.ccisCustomerCode;
                        item.list.forEach(item => {
                            if (this.menuActiveName == 27) {
                                item['packFormat'] = item.packName
                            }
                            item['packName'] = item.packType
                        })
                    })
                    WarehousingCreted(this.tableData.tableInfo,this.$props.wmsUrl).then(res=>{
                        if(res.data.returnCode === 200){
                            this.bLoading = false
                            this.$Message.success('保存成功');
                            this.$router.push({
                                name: 'planInfo',
                                query:{
                                    planNum: 1
                                }
                            })
                            this.$emit('initData');
                        } else {
                            this.bLoading = false
                            this.$Message.warning(res.data.returnMsg)
                        }
                    })
                }
            } catch {
                this.bLoading = false;
            }
        },
        onIsShows(){
            this.$router.push({
                name: 'planInfo',
                query:{
                    planNum: 1
                },
                params:{
                    menuActiveName: this.$route.query.menuActiveName
                }
            })
        },
        boxInformation(){
            this.$refs.multipleTable.clearSelection()
            const boxId = uuidv4()
            this.tableData.tableInfo.push({boxId,list:[]})
            this.$nextTick(() => {
                this.tableData.tableInfo.forEach(item => {
                    this.$set(item, 'businessType', 'into')
                })
            })
        },
        boxDelete(scope,rows){
            if(scope.row.list.length > 0){
                this.tableData.tableInfo = []
            }
            rows.splice(scope.$index,1)
            if(this.tableData.tableInfo.length == 0){
                this.isCreted = false
            }
        },
        handleSelectionChange(val, index) {
            this.multipleSelection = [];
            if (this.editItem) {
                return;
            }
            this.multipleSelection = val;
            this.isCreted = true
        },
        handleSelectionChanges(val) {
            this.multipleSelections = val;
        },
        boxCretedInfo(index,rows){
            this.$nextTick(() => {
                const goodsId = uuidv4()
                rows[index].list = _.cloneDeep(this.tableData.tableInfoList)
                rows[index].list.push({goodsId,categoryList:this.categoryList})
                this.$set(rows[index].list[rows[index].list.length - 1], 'ifCodeReading', false);
                this.tableData.tableInfoList = rows[index].list
                this.tableData.tableInfoList.forEach((item) => {
                    if (item.orderQty == undefined || item.orderWeight == undefined || item.validatePeriod == undefined) {
                        item.orderQty = 1;
                        item.orderWeight = 1;
                        item.validatePeriod = 1;
                        item.codeQty = 0;
                    }
                })
                this.$refs.multipleTable.clearSelection()
                this.$refs.multipleTable.toggleRowSelection(rows[index], true)
            })
            console.log(rows[index].list);
        },
        boxDtailDelete(scope){
            console.log(this.tableData.tableInfoList)
            this.tableData.tableInfoList.splice(scope.$index,1)
        },
        handleOnChange(row,index){
            this.$nextTick(() => {
                row.list.forEach((item) => {
                    if (item.ifCodeReading == 1 || item.ifCodeReading == true) {
                        item.ifCodeReading = true
                    } else {
                        item.ifCodeReading = false
                    }
                })
            })
            this.$nextTick(() => {
                this.selectRow = _.cloneDeep(row);
            })
            this.tableData.tableInfoList = row.list;
        },
        goodsInformation(){
            if(this.isCreted && this.tableData.tableInfo.length > 0){
                const goodsId = uuidv4()
                this.tableData.tableInfoList.push({goodsId,categoryList:this.categoryList})
            }else{
                this.$Message.error('请选择箱信息再创建');
            }
        },
        getBoxInfoDtail(){
            let body = {
                pageNum: 1,
                pageSize: 50,
                pageOptionsList: [
                    50,
                    100,
                    200
                ],
                filterList: [],
                sortList: [],
                searchKey: "",
                searchOrderType: "",
                searchOrderTypeList: [],
                notInMatTypeCodeList: [
                    "9999",
                    "0001"
                ]
            }
            getBoxInfoWarehousing(body,this.$props.wmsUrl).then(({ data })=>{
                console.log(data)
            })
        },
        batchDelete(){
            console.log(this.tableData.tableInfo)
            this.multipleSelection.forEach(item=>{
                for(let i = 0; i < this.tableData.tableInfo.length;i++){
                    if(item.boxId == this.tableData.tableInfo[i].boxId){
                        if(this.tableData.tableInfo[i].length> 0 && this.tableData.tableInfo[i].list[0].goodsId == this.tableData.tableInfoList[0].goodsId){
                            this.tableData.tableInfoList = []
                        }
                        this.tableData.tableInfo.splice(i,1);
                    }
                }
            })
            if(this.tableData.tableInfo.length == 0){
                this.isCreted = false
            }
        },
        batchDeletes(){
            for(let j = 0; j < this.multipleSelections.length;j++){
                for(let i = 0; i < this.tableData.tableInfoList.length;i++){
                    if(this.multipleSelections[j].goodsId == this.tableData.tableInfoList[i].goodsId){
                        this.tableData.tableInfoList.splice(i,1);
                    }
                }}
        },
        getInfoInte(){
            this.$nextTick(() => {
                getBusinessInfo(this.$props.wmsUrl).then(res =>{
                    this.$nextTick(() =>{
                        this.businessList = res.data.returnData.filter(item => {
                            if(this.menuActiveName == 37){
                              return item.dictName !== '空托盘上架' && item.dictName !== '退货入库';
                            }
                            return item.dictName !== '空托盘上架';
                        })
                    })
                })
                getCategoryInfo(this.$props.wmsUrl).then(res =>{
                    this.$nextTick(() => {
                        this.categoryList = res.data.returnData
                    })
                })
                packingSpecification(this.$props.wmsUrl).then(({ data })=>{
                    this.$nextTick(() => {
                        this.packingSpecificationList = data.returnData
                    })
                })
                /*if (this.menuActiveName == 37) {
                    getCargoSpecification({ownerCode: this.ccisCustomerCode}, this.$props.wmsUrl).then(({ data })=>{
                        this.$nextTick(() => {
                            this.cargoSpecificationList = data.returnData
                        })
                    })
                }*/
                this.getBoxInfoDtail()
                this.changesInfo()
            })
        },
        getWmsCustomerList() {
            getByCustomerType({customerProperty: 'h'}, this.$props.wmsUrl).then(response => {
                if (response.data.returnCode === 200) {
                    this.wmsCustomerList = response.data.returnData;
                } else {
                    this.$Message.error(response.data.returnMsg);
                }
            });
        },
        checkData() {
            console.log(this.selectRow);
            if (!this.selectRow) {
                this.$Message.warning('请先选择一条入库箱信息');
                return false;
            }
            this.$refs.attachmentRef.showUpload();
        },
        refreshFileList(row, fileList) {
            this.tableData.tableInfo.forEach(item => {
                if (row.boxId == item.boxId) {
                    item.fileList = fileList;
                }
            })
        }
    },
    async mounted() {
        this.getInfoInte()
        this.$props.wmsUrl = JSON.parse(this.$route.query.wmsUrl)
        this.getWmsCustomerList();
        if (this.customerInfoList.length === 1) {
            this.selectCustomer = this.customerInfoList[0].customerPartyCode;
            this.settlementCustomer = this.selectCustomer;
        }
        if (this.$route.query.editItem) {
            this.$props.editItem = JSON.parse(this.$route.query.editItem)
        }
        this.$props.editItemWarehousing = JSON.parse(this.$route.query.editItemWarehousing)
        this.$props.menuActiveName = JSON.parse(this.$route.query.menuActiveName)
        this.$props.wareList = JSON.parse(this.$route.query.wareList)
        this.$props.editData = JSON.parse(this.$route.query.editData)
        this.$props.editStatus = JSON.parse(this.$route.query.editStatus)

        if (!this.$props.wmsUrl) {
            this.$props.wmsUrl = this.wareList.filter(item => item.id == this.$route.params.menuActiveName)[0].ipProt;
        }

        

        await this.complete;
        if (this.customerInfoList.length === 1) {
            this.selectCustomer = this.customerInfoList[0].customerPartyCode;
            this.settlementCustomer = this.selectCustomer;
        }
        if (this.$props.editData) {
            const editData = this.$props.editData.returnData || this.$props.editData;
            this.selectCustomer = editData.ccisCustomerCode;
            this.settlementCustomer = editData.ccisSettlementCustomerCode;
        }
        this.selectCustomer && this.selectCustomerInfoByDto();
        
        if (this.editItem !== null && this.editItemWarehousing !== null) {
            let editItem = _.cloneDeep(this.editItem)
            let editItemWarehousing = _.cloneDeep(this.editItemWarehousing)
            if (this.editItem) {
                this.tableData.tableInfo.push(editItem)
                editItemWarehousing.forEach((item) => {
                    if (item.ifCodeReading == '1') {
                        item.ifCodeReading = true
                    } else {
                        item.ifCodeReading = false
                    }
                    this.tableData.tableInfoList.push(item);
                    this.tableData.tableInfo[0].businessType = _.cloneDeep(this.editData.returnData.businessType)
                })
                this.tableData.tableInfoList.forEach((item) => {
                    getBusinessInfos({matTypCode:item.matTypCode,ownerCode:this.ccisCustomerCode},this.$props.wmsUrl).then(res=>{
                        this.$set(item,'categoryLists', res.data.returnData)
                    })
                })
            }
            this.tableData.tableInfo[0]['list'] = _.cloneDeep(this.tableData.tableInfo[0].warehousing)
            if (this.tableData.tableInfo[0].fileList && this.tableData.tableInfo[0].fileList.length > 0) {
                this.$nextTick(() => {
                    this.selectRow = {fileList: this.tableData.tableInfo[0].fileList};
                });
            }
        }
    },
    watch: {
        '$store.state.user.userInfo': {
            handler(value) {
                if (!value || !value.entrustingPartyCode) return;
                this.resolveComplete();
            },
            deep: true,
            immediate: true
        }
    },
    computed: {
        customerInfoList() {
            return this.$utils.getUserInfo().customerInfoList || [];
        },
        isCustomerNameInWMS() {
            if (!this.selectCustomer) return true;
            const { customerPartyName } = this.customerInfoList.find(i => i.customerPartyCode === this.selectCustomer);
            return this.wmsCustomerList.some(i => i.customerName === customerPartyName);
        }
    }
}
</script>

<style lang="less" scoped>
.boxMsg {
    /deep/.el-table tbody td {
        padding: 0 !important;
    }
    /deep/.el-form-item {
        margin-bottom: 0 !important;
    }
}
</style>
